window.onload=function(){
    var menu=document.querySelector("#menu");
    var falg=false;
    var header= document.querySelector("header");
    var nav= document.querySelector("nav");
    var height=nav.offsetHeight;
    var max_height=height;
    nav.style.height="0px";
    nav.style.top=header.offsetHeight+"px";
    menu.addEventListener("click",function(){
        falg=!falg;
        if(falg){
            this.className="fa fa-toggle-on"
            if(height==21){
                nav.style.height="138px";
            }else{
                nav.style.height=height+"px";
            }
        }else{
            this.className="fa fa-toggle-off"
            nav.style.height="0px";
        }
    })
    window.addEventListener("resize",function(){
        if(document.body.clientWidth>=768){
            height=nav.offsetHeight;
        }else{
            height=max_height;
        }
    })
}
